electron打开文件的几种实现方式 |
您所在的位置：网站首页 › electron 文档 › electron打开文件的几种实现方式 |
|
1. 程序已经启动，通过点击打开文件，进行打开
this.$dialog
.showOpenDialog({
title: "打开文件",
defaultPath: "",
properties: ["openFile"],
// properties: ['openFile', 'multiSelections'],
filters: [
{ name: "Text", extensions: ["icode"] },
{ name: "Custom File Type", extensions: ["as"] },
{ name: "All Files", extensions: ["*"] }
]
})
.then(result => {
if (!result.canceled && result.filePaths.length > 0) {
this.$emitNode("tradeMenu", "open", result.filePaths[0]);
// 监听主进程读完文件数据
this.$onNodeOnce("tradeMenuOpen", (event, arg) => {
let trade = openFormat(result.filePaths[0], arg);
this.newEditTrade(trade);
});
}
})
.catch(err => {
console.log(err);
});
其中的$dialog，emitNode，onNodeOnce等待都是利用electron的，利用Vue进行封装的，result是选中文件的一系列数据 Vue.prototype.$onNodeOnce=function(channel, listener){ ipcRenderer.once(channel, listener) }; // 监听主线程消息 Vue.prototype.$onNode = function(channel,listener){ ipcRenderer.on(channel, listener) } // 文件弹框全局使用 Vue.prototype.$dialog = dialog 2. 在桌面直接打开文件(.html)，会自动打开软件，并读取文件， 或者将(.html)文件移动到程序图标上进行打开。 这个分两步，1.让程序能够代开文件，2.程序读取文件路径 "mac": { "icon": "./logo.icns", "fileAssociations": [ { "ext": [ "icode" ] } ], "target": [ { "target": "dmg" } ] }, "dmg": { "title": "ICODE", "icon": "./logo.icns", "backgroundColor": "#ffffff", "contents": [ { "x": 192, "y": 344 }, { "x": 448, "y": 344, "type": "link", "path": "/Applications" } ] },主要利用fileAssociations来注册程序打开后缀名。 //主线程代码 global.fileToOpen = ""; app.on('open-file', (event, path) => { // 当用户想要在应用中打开一个文件时发出。 // 事件通常在应用已经打开，并且系统要再次使用该应用打开文件时发出。 // 也会在一个文件被拖到 dock 并且还没有运行的时候发出。 event.preventDefault() fileToOpen = path; //win是打开的窗口，如果程序未启动则不会触发 //窗口打开后可通过渲染进程代码global来获取路径 if(win){ win.webContents.send("activateThenOpenFile",fileToOpen) } }); //渲染进程代码(路径得到就ok了) let currentFile = this.$electronRemote.getGlobal('fileToOpen') || null; 3. 程序已经启动，通过点击打开文件，进行打开 //参考2程序以及启动。主进程 if(win){ win.webContents.send("activateThenOpenFile",fileToOpen) } // 渲染进程 // 程序启动后双击-----打开文件 this.$onNode("activateThenOpenFile",(event,path)=>{ if (__.isString(path) && /\.icode$/.test(path)) { this.$emitNode("tradeMenu", "open", path); // 监听主进程读完文件数据 this.$onNodeOnce("tradeMenuOpen", (event, arg) => { let trade = openFormat(path, arg); this.newEditTrade(trade); }); } }) 4. 程序已经启动，通过移动文件到程序打开的页面，进行打开这主要就要依赖原生拖拽 // 拖拽进程序打开文件 let drag = document.getElementById("drag") //此方法删除不行 drag.addEventListener("dragover", (e)=>{ // 用来hack某些兼容性问题 e.dataTransfer.dropEffect = "copy"; e.stopPropagation(); e.preventDefault(); }, false); drag.addEventListener("drop", (e)=>{ e.preventDefault(); e.stopPropagation(); if(e.dataTransfer.files[0].path){ let path = e.dataTransfer.files[0].path this.$emitNode("tradeMenu", "open", path); // 监听主进程读完文件数据 this.$onNodeOnce("tradeMenuOpen", (event, arg) => { let trade = openFormat(path, arg); this.newEditTrade(trade); }); } }, false);以上代码无法粘贴复制直接使用，但是能够提供方向，以及一些重要API方法。 |
今日新闻 |
推荐新闻 |
| CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3 |